<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>化验单_ 三级联动</title>
    <include file="Common:header_include"/>
    <!-- Bootstrap -->
    <!--<link href="../../../../../index.php" rel="stylesheet">-->
    <!--<link rel="stylesheet" href="../../../../../index.php"/>-->
    <!--<link rel="stylesheet" href="../../../../../index.php"/>-->
    <!--<link rel="stylesheet" href="../../../../../index.php"/>-->
    <!--&lt;!&ndash;[if lt IE 9]>-->
    <!--<script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>-->
    <!--<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>-->
    <!--<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>-->
    <![endif]-->
    <script>
        function check(id) {
            var frameSrc = "{:U('hyd/sanjiliandong')}" + "?id=" + id;
            $("#hylx").attr("src", frameSrc);
            $('#hylxModal').modal({show: true, backdrop: 'static'});
        }
    </script>
    <style>
        .select {
            width: 100%;
            /*text-align: center;*/
            vertical-align: middle;
            margin-bottom: 20px;
        }

        .select table {
            margin-bottom: 20px;
            margin-top: 20px;
        }

        table tr td {
            border: 1px solid #dddddd;
            line-height: 30px;
            width: 33%;
        }

        .select .form-control {
            width: 32%;
            display: inline-block;
            margin: 7px 0;
        }

        table {
            width: 100%;
        }

        .table-hover tr td {
            width: 33%;
        }
    </style>
</head>
<body>
<div id="Laboratory" style="width:750px;padding:0 20px;margin:0 auto;"> <!--背景色、边框、阴影-->
    <!--<p>请选择化验类型：</p>-->
    <div class="select">
        <table>
            <tr>
                <td colspan="3" class="text-left" style="background: #fafafa"><b style="margin-left: 10px">请选择化验类型:</b>
                </td>
            </tr>
            <tr class="text-center">
                <td colspan="3">
                    <select name="" id="" class="form-control">
                        <option>甲肝</option>
                        <option>乙肝</option>
                        <option>丙肝</option>
                        <option>甲肝</option>
                    </select>
                    <select name="" id="" class="form-control">
                        <option>乙肝两对半</option>
                        <option>乙肝两对半</option>
                        <option>乙肝两对半</option>
                        <option>乙肝两对半</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td colspan="3" class="text-left" style="background: #fafafa"><b style="margin-left: 10px">化验详情</b></td>
            </tr>
            <tr>
                <td colspan="3" style="padding:0 10px">乙肝两对半 乙肝两对半
                    乙肝两对半乙肝两对半乙肝两对半乙肝两对半乙肝两对半乙肝两对半乙肝两对半乙肝两对半乙肝两对半乙肝两对半乙肝两对半乙肝两对半 乙肝两对半 乙肝两对半
                </td>
            </tr>
        </table>
        <p class="text-center" id="center">
            <button type="button" class="btn btn-success">提交</button>
        </p>

    </div>
    <!--已选的化验项-->
    <table class="table table-bordered text-center table-hover" id="jiancha">
        <thead>
        <tr>
            <th colspan="3" class="text-left" style="background: #fafafa"><b style="margin-left: 10px">已选择的化验项:</b></th>
        </tr>

        <tr style="background: #f2f2f2">
            <th class="text-center" style="border: 1px solid #dddddd;width: 25%"><b>检验项目</b></th>
            <th class="text-center" style="border: 1px solid #dddddd;width: 25%"><b>日期</b></th>
            <th class="text-center" style="border: 1px solid #dddddd;width: 25%"><b>操作</b></th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td title="123"><a href="">乙肝</a></td>
            <td>2017.12.12</td>
            <td><a href="javascript:;" class="btn-xs btn-warning">删除</a></td>
        </tr>
        <tr>
            <td title="123"><a href="">甲肝</a></td>
            <td>2017.12.12</td>
            <td><a href="javascript:;" class="btn-xs btn-warning">删除</a></td>
        </tr>
        </tbody>
    </table>
    <p class="text-center">
        <button type="button" class="btn btn-danger" id="btndd">关闭</button>
    </p>
</div>

<script src="../../../../../index.php"></script>
<script src="../../../../../index.php"></script>
<script>
    $(document).on("click", "#center .btn", function () {
        $("#jiancha tbody").prepend('<tr><td title="123"><a href="">甲肝</a></td><td>2017.12.12</td><td><a href="javascript:;" class="btn-xs btn-warning" >删除</a></td></tr>');
    });
    $(document).on("click", "#jiancha tbody td a", function () {
        $(this).parents("tr").remove();
    });
    $("#btndd").click(
            function(){
                window.parent.$('#hylxModal').modal("hide");
            }
    );

</script>
</body>
</html>